<template>
	<view class="msg_box">
		<form>
			<view class="pub_block">
				<view class="tit">商品信息</view>
				<view class="con">
					<view class="item"><view class="label">商品类型：</view><text>{{order.product.productTypeName}}</text></view>
					<view class="item"><view class="label">商品名称：</view><text>{{order.product.productName}}</text></view>
					<view class="item"><view class="label">套餐类型：</view><text>{{order.product.productTypeName}}</text></view>
					<view class="item"><view class="label">出发时间：</view><text>{{order.tripBeginDate}}</text></view>
					<view class="item"><view class="label">集合地点：</view><text>{{order.product.productRendezvous}}</text></view>
				</view>
			</view>
			<view class="pub_block" v-if="order.accompaniers">
				<view class="tit">游客信息</view>
				<view class="con">
					<view class="item"><view class="label">出行人：</view><text>{{order.adultQty}}大{{order.childQty}}小</text></view>
					<block v-for="(item,index) in order.accompaniers" v-if="item.type==1">
						<view class="item text_indent"><text>姓名{{index}}：{{item.name}}</text></view>
						<view class="item text_indent"><text>证件号：{{item.idCard}}</text></view>
						<view class="item text_indent"><text>手机号：{{item.mobilePhone}}</text></view>
					</block>
				</view>
			</view>
			<view class="pub_block">
				<view class="tit">订单价格</view>
				<view class="con">
					<view class="item"><view class="label">金额：</view><text>成人{{order.productPrice}} 元/人*{{order.adultQty}}人+儿童{{order.productChildrenPrice}}元/人*{{order.childQty}}人={{totalAmount}}元</text></view>
					<view class="item"><view class="label">保险费：</view><text>{{order.insurancePrice}}元/人*{{totalNum}}/人 ={{totalInsurance}}元</text></view>
					<view class="item"><view class="label">单房差：</view><text>{{order.productSingleRoomDifference}}元</text></view>
					<view class="item"><view class="label">会员费：</view><text>{{order.vipAmount}}元</text></view>
					<view class="item"><view class="label">支付合计：</view><text>￥{{order.totalPayAmount}}元</text></view>
				</view>
			</view>
			<view class="btns text_right">
				<button @click="backOrderConfirm()">需要修改</button><button>退订规则</button>
			</view>
			<!-- <view class="pub_block">
				<view class="prompt_tit"><text>加入”乐芭兔Maker”收益式会员</text><text>会员机制？</text></view>
				<view class="prompt text_indent">尊敬的(预订人)先生/女士，如加入“乐芭兔Maker”会员,本订单将优惠：</view>
				<view class="prompt text_indent">成人300乐兔币/人*2人+儿童200乐兔币/人*1人=800乐兔币</view>
				<view class="prompt text_indent">(该优惠将在旅游结果后7个工作日内退到您的“乐芭兔收益帐户”上，您可以随时提现。1乐兔币=1元人民币)。</view>
				<checkbox-group>
				  <label class="checkbox">
					<checkbox value="Agreement"/>我已阅读并同意本《协议名称》
				  </label>
				</checkbox-group>
				<checkbox-group >
				  <label class="checkbox">
					<checkbox value="Insurance" checked="true" disabled="true"/>购买旅游意外险：18元/人<text>险种说明？</text>
				  </label>
				</checkbox-group>
			</view> -->
			<view class="confirm_btn dis_fx">
				<button @click="prepay()">确认支付</button>
			</view>
		</form>
	</view>
</template>

<script>
	var jweixin = require('jweixin-module')
	import util from '../../../common/util.js'
	export default {
		data() {
			return {
				orderId:'',
				order:null,
				productPrice:0,
				adultQty:0,
				childrenPrice:0,
				childQty:0,
				totalAmount:0,//总金额
				totalPayAmount:0,//总支付金额 在勾选购买会员是，需要重新计算
				productSingleRoomDifference:0,//单房差
				vipAmount:0,
				vipLevel:0,//当前会员等级，默认0 不是会员 判断如果不是会员时勾选成为会员要加入计算
				totalNum:0,
				totalInsurance:0
			}
		},
		onLoad(options){
			var orderId=options.orderId;
			if(!orderId || orderId=="" || typeof(orderId)=="undefined" || orderId=="undefined"){
				orderId="0"
			}
			this.orderId=orderId;
		},
		onShow() {
			this.getOrder();
		},
		methods: {
			//修改信息
			backOrderConfirm(){
				var that=this;
				var params={
					id:that.orderId,
					accompaniers:that.order.accompaniers
				}
				uni.$emit('updateOrderId',params)
				uni.navigateBack({
					delta: 1
				});
			},
			//获取预支付信息
			prepay(){
				var that=this
				var params={orderId:that.orderId}
				util.fetchGet('/api/wxJsApiPay',params,function(res){
					//console.log(res)
					if(res.data){
						
						/*
						jweixin.config({  
						     debug: true,  
						     appId: res.data.appId,  
						     timestamp:res.data.timeStamp,  
						     nonceStr: res.data.nonceStr,  
							 package : res.data.package,
						     signature:res.data.paySign,  
						     jsApiList: [  
						         'checkJsApi',  
						         'onMenuShareTimeline',  
						         'onMenuShareAppMessage'  
						     ]  
						});
						*/
						
						
						if (typeof WeixinJSBridge == "undefined"){
						   if( document.addEventListener ){
							   document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
						   }else if (document.attachEvent){
							   document.attachEvent('WeixinJSBridgeReady', onBridgeReady); 
							   document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
						   }
						}else{
						   that.onBridgeReady(res);
						}
					}
				},function(){},true)
			},
			onBridgeReady(res){
			
				
			   WeixinJSBridge.invoke('getBrandWCPayRequest', {
				"appId" : res.data.appId, //公众号名称,由商户传入     
				"timeStamp" : res.data.timeStamp, //时间戳,自1970年以来的秒数     
				"nonceStr" : res.data.nonceStr, //随机串     
				"package" : res.data.package,
				"signType" : res.data.signType, //微信签名方式：     
				"paySign" : res.data.paySign
			//微信签名 
			}, function(res) {
				//alert(JSON.stringify(res));
				if (res.err_msg == "get_brand_wcpay_request:ok") {
					
					uni.showModal({
						content: '支付成功',
						showCancel: false
					});	
					uni.navigateTo({url: '/pages/order/myOrder/myOrder'})
					console.log('支付成功');
					//支付成功后跳转的页面
				} else if (res.err_msg == "get_brand_wcpay_request:cancel") {
					console.log('支付取消');
				} else if (res.err_msg == "get_brand_wcpay_request:fail") {
					console.log('支付失败');
					WeixinJSBridge.call('closeWindow');
				} //使用以上方式判断前端返回,微信团队郑重提示：res.err_msg将在用户支付成功后返回ok,但并不保证它绝对可靠。
			});
			},
			//获取订单信息 
			getOrder(){
				uni.showLoading({
					mask:true,
					title: '加载中'
				});
				var that=this;
				let orderId=that.orderId;
				if(!orderId){
					orderId=0
				}
				var params={
					orderId:orderId
				}
				// var params={
				// 	orderId:"48"
				// }
				util.fetchGet('/order/view/'+orderId,params,function(res){
					let order=res.data
					order.tripBeginDate=util.formatDate(new Date(order.tripBeginDate),"yyyy-MM-dd");
					order.tripEndDate=util.formatDate(new Date(order.tripEndDate),"yyyy-MM-dd");
					that.order=order;
					that.vipAmount =order.vipAmount;
					that.vipLevel =order.vipLevel;
					
					if(order.productChildrenPrice){
							that.childrenPrice =parseFloat(order.productChildrenPrice);
					}
					
					
					if(order.productPrice){
							that.productPrice =parseFloat(order.productPrice);
					}
					
				
						
					if(order.adultQty){
							that.adultQty =parseFloat(order.adultQty);
					}
					
					if(order.childQty){
							that.childQty =parseFloat(order.childQty);
					}
					
				   
					that.totalAmount =that.productPrice*that.adultQty +that.childrenPrice* that.childQty;
					that.totalNum = that.adultQty+that.childQty;
					that .totalInsurance =parseFloat(order.insurancePrice)*	that.totalNum;
					
					that.totalPayAmount =that.totalAmount
					
					uni.hideLoading();
				},function(){},true)
			},
			toNewPage(url){
				uni.navigateTo({url})
			},
			
			
		}
	}
</script>

<style>
	.msg_box{
		padding: 0 20upx 120upx;
	}
	.pub_block{
		margin-top: 20upx;
		box-shadow: 0 0 10upx 5upx #E6E6E6;
		border-radius: 10upx;
		padding: 20upx 25upx 30upx;
	}
	.pub_block .tit{
		font-size: 29upx;
		color: #000000;
		margin-bottom: 40upx;
	}
	.pub_block .item{
		display: flex;
		align-items: center;
		margin-top: 20upx;
		font-size: 25upx;
	}
	.pub_block .item .label{
		color: #000000;
	}
	.pub_block .item text{
		color: #6d6d6d;
	}
	.btns{
		padding: 40upx 0 20upx;
		font-size: 0;
	}
	.btns button{
		font-size: 28upx;
		color: #ffffff;
		background: #FD7D2A;
		height: 50upx;
		line-height: 50upx;
		padding: 0 25upx;
		display: inline-block;
		margin-right: 30upx;
	}
	.text_indent{
		text-indent: 2em;
	}
	.pub_block .prompt_tit{
		display: flex;
		justify-content: space-between;
		font-size: 23upx;
		color: #fd7d2a;
		margin-bottom: 20upx;
	}
	.pub_block .prompt{
		font-size: 20upx;
		color: #000000;
		line-height: 2;
	}
	uni-checkbox-group{
		margin-top: 25upx;
		font-size: 23upx;
		color: #fd7d2a;
	}
	.confirm_btn{
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 100upx;
		background: #FFC800;
		/* padding: 0 24upx; */
		z-index: 3;
	}
	.confirm_btn button{
		background: transparent;
		font-size: 34upx;
		color: #433d2c;
		line-height: 100upx;
		height: 100upx;
		width: 100%;
	}
</style>
